<template>
	<view class="banquet-info">
		<view class="c-row-box">
			<view class="c-row-head">
				<view class="c-row-title">婚宴信息</view>
			</view>
			<view class="c-row-item">
				<view class="c-row c-row-list">
					<view class="c-row-col c-row-col-list-item">
						<view class="col-title"><text style="color: red;">*</text>承办公司</view>
						<view class="col-text">
							<picker mode="selector" :range="companyList" range-key="title" @change="companyChange" :disabled="isPreview">
								<view>{{ selectedCompany }}</view>
							</picker>
						</view>
					</view>
				</view>
				<view class="c-row c-row-list">
					<view class="c-row-col c-row-col-list-item">
						<view class="col-title"><text style="color: red;">*</text>婚宴桌数</view>
						<view class="col-text">
							<input type="digit" v-model="banquetParams.table_amount" @input="banquetChange" :disabled="isPreview"
								placeholder="请输入" />
						</view>
					</view>
				</view>
				<view class="c-row c-row-list">
					<view class="c-row-col c-row-col-list-item">
						<view class="col-title"><text style="color: red;">*</text>婚宴餐标</view>
						<view class="col-text">
							<input type="digit" v-model="banquetParams.table_price" @input="banquetChange" :disabled="isPreview"
								placeholder="请输入" />
						</view>
					</view>
				</view>
				<view class="c-row c-row-list">
					<view class="c-row-col c-row-col-list-item">
						<view class="col-title">优惠金额</view>
						<view class="col-text">
							<input type="digit" v-model="banquetParams.banquet_discount" @input="banquetChange" :disabled="isPreview"
								placeholder="请输入" />
						</view>
					</view>
				</view>
				<view class="c-row c-row-list">
					<view class="c-row-col c-row-col-list-item">
						<view class="col-title"><text style="color: red;">*</text>餐饮总价</view>
						<view class="col-text">
							<text>{{banquetParams.banquet_totals}}</text>
						</view>
					</view>
				</view>
			</view>
		</view>

	</view>
</template>

<script>
	import dictionary from '@/utils/dictionary.js';
	
	export default {
		props: {
			isPreview: {
				type: Boolean,
				default () {
					return false
				}
			},
			banquetParams: {
				type: Object,
				default () {
					return {}
				}
			},
			order: {
				type: Object,
				default () {
					return {}
				}
			},
		},
		data() {
			return {
			};
		},
		computed: {
			companyList: function() {
				let companyList = dictionary.getPicker('companyList');
				companyList = companyList.filter(ele => ele.is_valid == 1);
				
				return companyList;
			},
			selectedCompany: function() {
				return dictionary.getPickerTitle('companyList', this.banquetParams.company_id, '请选择');
			},
		},
		beforeMount() {
			this.dictionary = dictionary;
		},
		methods: {
			// 选择公司
			companyChange(e) {
				let index = e.target.value
				this.banquetParams.company_id = this.companyList[index].id
			},
			
			// 婚宴信息发生变化
			banquetChange() {
				let that = this;
				that.banquetParams.banquet_totals =
					(parseFloat(that.banquetParams.table_amount === '' ? 0 : that.banquetParams.table_amount) *
						parseFloat(that.banquetParams.table_price === '' ? 0 : that.banquetParams.table_price) -
						parseFloat(that.banquetParams.banquet_discount === '' ? 0 : that.banquetParams.banquet_discount))
					.toFixed(2)

				that.$emit('getOrderTotals')
			},
		}
	}
</script>

<style lang="less">
@import url('../../components/common.less');
@import url('../common/common.less');
</style>
